<template>
	<web-view src="/hybrid/html/veh-trajectory/index.html"></web-view>
</template>

<script>
	import {
		getCarDetail,
		transChannelList,
		VehTrackList,
		zcPage
	} from '@/common/api/monitor.js'
	import trajectoryTracking from './trajectoryTracking.vue'
	import {
		dateFormat,
		// getAmapConvert,
		getAddress
	} from "@/common/util.js"

	export default {
		components: {
			trajectoryTracking
		},
		data() {
			return {
				queryData: {
					vehCode: '',
					context: 'province-this',
					vehColor: '',
				},
				timeData: {},
				// 折叠面板-数据
				collapseData: {
					carData: {
						speed: "",
						lastGpsTime: "",
						address: "",
					},
					portal: [],
					zcList: [],
					warningList: [],
					rwVehicleBaseVO: {
						ownerId: "",
						vehCode: "",
						vehColor: "",
						mgrArea: "",
						ccertId: "",
						firstDate: "",
						expireDate: "",
						ccertState: "",
						nextVehRankDate: "",
						nextCheckDate: "",
						insuredValidDate: "",
						fa: "",
						ownerName: "",
					},
					carrieInfoVO: {
						ownerId: "",
						ownerName: "",
						ownerType: "",
						mgrArea: "",
						mcertId: "",
						firstDate: "",
						expireDate: "",
						grantOrgan: "",
						state: "",
						contacts: "",
						ptTel: "",
					},
					trailerInforVO: {
						ownerId: "",
						vehCode: "",
						vehColor: "",
						mgrArea: "",
						ccertId: "",
						firstDate: "",
						expireDate: "",
						ccertState: "",
						nextVehRankDate: "",
						nextCheckDate: "",
						insuredValidDate: "",
					},
					wayBillInfoVO: {
						billNo: "",
						loadingAddr: "",
						loadingZipCode: "",
						unloadingAddr: "",
						unloadingZipCode: "",
						endTransTime: "",
						startTransTime: "",
						goodsInfo: "",
					},
					staffInfoVO: {
						driverName: "",
						driverCertNo: "",
						driverValidEndDate: "",
						escortName: "",
						escortCertNo: "",
						escortValidEndDate: "",
					},
					outTrafficVO: {
						notransId: "",
						moveStartTime: "",
						moveEndTime: "",
						startPosAddr: "",
						// startPosZipCode
						endPosAddr: "",
						endPosZipCode: "",
						vehCode: "",
						vehColor: "",
						trailerNo: "",
						type: "",
						note: "",
						createTime: "",
					},
					mark: ""

				},
				// 字典值
				selectOptions: {
					// 企业经营状态
					owner_state: [],
					owner_state_obj: {},
					// 车辆营运状态
					ccert_state: [],
					ccert_state_obj: {},
					// 运单状态
					bill_state: [],
					bill_state_obj: {},
				},
				linePath: [],
			}
		},
		methods: {
			getCarDetail() {
				const params = {}
				getCarDetail(this.queryData)
					.then(res => {
						const resData = res.data.data
						Object.assign(this.collapseData.rwVehicleBaseVO, resData.rwVehicleBaseVO);
						Object.assign(this.collapseData.carrieInfoVO, resData.carrieInfoVO);
						Object.assign(this.collapseData.trailerInforVO, resData.trailerInforVO);
						Object.assign(this.collapseData.wayBillInfoVO, resData.wayBillInfoVO);
						Object.assign(this.collapseData.staffInfoVO, resData.staffInfoVO);
						Object.assign(this.collapseData.outTrafficVO, resData.outTrafficVO);
						this.collapseData.warningList = resData.vehicleBaseVO;

						Object.assign(params, {
							vehCode: resData.rwVehicleBaseVO.vehCode,
							vehColor: resData.rwVehicleBaseVO.vehColor,
							startTime: resData.wayBillInfoVO.startTransTime,
							endTime: resData.wayBillInfoVO.endTransTime,

							// vehCode: "皖KX5566",
							// vehColor: "黄色",
							// startTime: "2023-04-13 00:00:00",
							// endTime: "2023-04-14 00:00:00",
						})
						// 门架数据
						return transChannelList(params)
					}).then(res => {
						this.collapseData.portal = res.data.data;
						// 轨迹数据
						if (!params.startTime || !params.endTime) {
							params.endTime = dateFormat(new Date());
							params.startTime = dateFormat(
								new Date(new Date().getTime() - 60 * 60 * 1000)
							);
						}
						return zcPage({
							vehCode: params.vehCode,
						});
					}).then(res => {
						// this.linePath = res.data.data;
						// this.initMap();
						this.collapseData.zcList = res.data.data.records;
						return VehTrackList(params);
					}).then(res => {
						this.linePath = res.data.data;
						this.initMap();
					}).catch((err) => {
						console.log(err);
					});
			},
			initMap() {
				const data = {
					linePath: this.linePath,
					collapseData: this.collapseData,
					selectOptions: this.selectOptions,
					context: this.queryData.context,
				};
				// this.$refs['trajectory-tracking'].initData(data);
				const webview = this.$mp.page.$getAppWebview().children()[0];
				console.log(123, data.collapseData)
				// webview.evalJS("receiveData(`" + JSON.stringify(data) + "`)");
				webview.evalJS("receiveData('" + JSON.stringify(data) + "')");
			},
			initSelect() {
				this.$api.getDict("bill_state")
					.then((res) => {
						this.selectOptions["bill_state"] = res.data.data.map((item) => {
							this.selectOptions["bill_state_obj"][item.dictKey] = item.dictValue;
							return {
								label: item.dictValue,
								value: item.dictKey,
							};
						});
						return this.$api.getDict("owner_state");
					}).then((res) => {
						this.selectOptions["owner_state"] = res.data.data.map((item) => {
							this.selectOptions["owner_state_obj"][item.dictKey] = item.dictValue;
							return {
								label: item.dictValue,
								value: item.dictKey,
							};
						});
						return this.$api.getDict("ccert_state");
					}).then((res) => {
						this.selectOptions["ccert_state"] = res.data.data.map((item) => {
							this.selectOptions["ccert_state_obj"][item.dictKey] = item.dictValue;
							return {
								label: item.dictValue,
								value: item.dictKey,
							};
						});
						this.getCarDetail();
					});
			}
		},
		onLoad(option) { //option为object类型，会序列化上个页面传递的参数
			this.queryData = JSON.parse(option.param);
			this.timeData = JSON.parse(option.lastTime);
			getAddress(this.timeData.longitudePoint, this.timeData.latitudePoint).then(res => {
				Object.assign(this.collapseData.carData, this.timeData, {
					address: res,
				});
				console.log(333333, this.collapseData.carData)
			})
			this.initSelect();

		}
	}
</script>